<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>注册界面</title>
    <style>
        fieldset {
            border: 1px solid #000; /* 设置边框粗细为1px，颜色为黑色 */
            width: 300px; /* 设置fieldset的宽度 */
            margin: 0 auto;
        }
    </style>    
</head>
<body align="center">
   
    <caption><h3>用户注册</h3></caption>
    <fieldset>
        <form action="#" method="post">
            <table cellpadding="10px" align="center">
                <tr>
                    <td>用户名</td>
                    <td><input type="text"  class="name" name="username" /></td>
                </tr>
                <tr>
                    <td>密码</td>
                    <td><input type="password" class="pwd" name="password" /></td>
                </tr>
                <tr>
                    <td>密码确认</td>
                    <td><input type="password" class="pwd" name="password" /></td>
                </tr>
            </table>
        </form>
        <legend>身份验证-必填信息</legend>
    </fieldset>
    <fieldset>
        <form>
            <table cellpadding="10px" align="center">
                <tr>
                    <td>所在城市</td>
                    <td>
                        <select name="address">
                            <option value="beijing">北京</option>
                            <option value="shanghai">上海</option>
                            <option value="shenzhen">深圳</option>
                            <option value="hangzhou">杭州</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>工作单位</td>
                    <td><input type="radio" name="business address" value="weiruan" />微软
                    <input type="radio" name="business address" value="huawei" />华为
                    <input type="radio" name="business address" value="xiaomi" />小米</td>
                </tr>
                <tr>
                    <td>家庭住址</td>
                    <td><input type="text" name="address" /></td>
                </tr>
            </table>
        </form>
        <legend>身份信息-选填信息</legend>
    </fieldset>  
    <fieldset>
        <form>
            <table cellpadding="10px" align="center">
                <tr>
                    <td>性别</td>
                    <td>
                        <select name="gender">
                            <option value="male">男</option>
                            <option value="female">女</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td>爱好</td>
                    <td><input type="checkbox" name="hobby" value="music" />音乐
                        <input type="checkbox" name="hobby" value="physical education" />体育
                        <input type="checkbox" name="hobby" value="computer" />计算机
                  </td>
                </tr>
                <tr>
                    <td>喜欢的公司</td>
                    <td><input type="radio" name="business address" value="baidu" />百度
                    <input type="radio" name="business address" value="weiruanzhongguo" />微软中国
                    <input type="radio" name="business address" value="gugezhongguo" />谷歌中国</td>
                </tr>
                <tr>
                    <td>个人简介</td>
                    <td>
                        <textarea name="evaluate" cols="20" rows="5"></textarea>
                    </td>
                </tr>
            </table>
        </form>
        <legend>其他个人信息</legend>
    </fieldset>
    <form action="#" method="post">  
    <tr>
       <td colspan="2" align="center">
           <input type="submit" value="提交您的资料" />
           <input type="reset" value="重新填写资料" /></td>
        </tr><br/>
        <tr>
            <td><input type="button" disabled value="无效按钮" /> </td>
        </tr>
    </form>
    <a href="#" target="_self">回到顶部</a>
</body>